import React, { useState } from 'react'
import { Picker, Text, View, Input } from '@tarojs/components'

const AddressQuestion = (props) => {
    const { data = {}, index, ChangeValue } = props
    const {
        title,
        label,
        require = false,
        desc,
        value,
        rule = 'area',
        addressType,
        addressValue
    } = data
    const [visible, setVisible] = useState(false)

    const renderTitle = {
        province: '省',
        city: '省市',
        area: '省市区'
    }[rule]
    const renderOption = {
        province: 'province',
        city: 'city',
        area: 'region',
    }[rule]
    return <View className='CollectWps_box_content'>
        <View className='CollectWps_label'>{require && <Text style={{ color: "red", right: 4 }}>*</Text>}{label}</View>
        <View className='CollectWps_desc'>{desc}</View>
        <Picker
            fields={renderOption}
            onChange={(e) => {
                ChangeValue({
                    index,
                    value: {
                        value: e.detail.value
                    }
                })

            }}
            value={value}
            mode={'region'}
        >
            <View className='CollectWps_dropdown'>
                {value ? value : '请选择' + renderTitle}
            </View>
        </Picker>

        {addressType && <View className='CollectWps_input_address'>
            <Input placeholder='请输入详细地址' value={addressValue} onInput={(e) => {
                ChangeValue({
                    index,
                    value: {
                        addressValue: e.detail.value
                    }
                })
            }}> </Input>
        </View>}


    </View>
}
export default AddressQuestion